<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md6">
                    <div class="layui-card">
                        <div class="layui-card-header">快捷方式</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-shortcut">
                                <div carousel-item>
                                    <ul class="layui-row layui-col-space10">
                                        <li class="layui-col-xs3">
                                            <a lay-href="/">
                                                <i class="layui-icon layui-icon-console"></i>
                                                <cite>主页</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="base/goods_type">
                                                <i class="layui-icon layui-icon-chart"></i>
                                                <cite>商品类型</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="base/goods">
                                                <i class="layui-icon layui-icon-template-1"></i>
                                                <cite>商品</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="base/supplier">
                                                <i class="layui-icon layui-icon-chat"></i>
                                                <cite>供应商</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="base/store">
                                                <i class="layui-icon layui-icon-find-fill"></i>
                                                <cite>仓库</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="personnel/dep">
                                                <i class="layui-icon layui-icon-survey"></i>
                                                <cite>部门</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="personnel/emp">
                                                <i class="layui-icon layui-icon-user"></i>
                                                <cite>员工</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="purchase/orders_add">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>采购申请</cite>
                                            </a>
                                        </li>
                                    </ul>
                                    <ul class="layui-row layui-col-space10">
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs3">
                                            <a lay-href="set/user/info">
                                                <i class="layui-icon layui-icon-set"></i>
                                                <cite>我的资料</cite>
                                            </a>
                                        </li>
                                    </ul>

                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-card">
                        <div class="layui-card-header">待办事项</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-backlog">
                                <div carousel-item>
                                    <ul class="layui-row layui-col-space10">
                                        <li class="layui-col-xs6">
                                            <a class="layadmin-backlog-body" lay-href="app/content/comment">
                                                <h3>待审评论</h3>
                                                <p><cite>66</cite></p>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs6">
                                            <a class="layadmin-backlog-body" lay-href="app/forum/list">
                                                <h3>待审帖子</h3>
                                                <p><cite>12</cite></p>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs6">
                                            <a class="layadmin-backlog-body" lay-href="template/goodslist">
                                                <h3>待审商品</h3>
                                                <p><cite>99</cite></p>
                                            </a>
                                        </li>
                                        <li class="layui-col-xs6">
                                            <a class="layadmin-backlog-body" href="javascript:;"
                                               onclick="layer.tips('不跳转', this, {tips: 3});">
                                                <h3>待发货</h3>
                                                <p><cite>20</cite></p>
                                            </a>
                                        </li>
                                    </ul>
                                    <ul class="layui-row layui-col-space10">
                                        <li class="layui-col-xs6">
                                            <a class="layadmin-backlog-body" href="javascript:;">
                                                <h3>待审友情链接</h3>
                                                <p><cite style="color: #FF5722;">5</cite></p>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">数据概览</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade"
                                 lay-filter="LAY-index-dataview">
                                <div carousel-item id="LAY-index-dataview">
                                    <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
                                    <!-- <div></div> -->
                                    <div></div>
                                </div>
                            </div>

                        </div>
                    </div>

                    <div class="layui-card">
                        <div class="layui-card-header">访客地区分布</div>
                        <div class="layui-card-body">
                            <div class="layui-row layui-col-space15">
                                <div class="layui-col-sm4">
                                    <table class="layui-table layuiadmin-page-table" lay-skin="line">
                                        <thead>
                                        <tr>
                                            <th>排名</th>
                                            <th>地区</th>
                                            <th>人数</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td>1</td>
                                            <td>浙江</td>
                                            <td>62310</td>
                                        </tr>
                                        <tr>
                                            <td>2</td>
                                            <td>上海</td>
                                            <td>59190</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td>广东</td>
                                            <td>55891</td>
                                        </tr>
                                        <tr>
                                            <td>4</td>
                                            <td>北京</td>
                                            <td>51919</td>
                                        </tr>
                                        <tr>
                                            <td>5</td>
                                            <td>山东</td>
                                            <td>39231</td>
                                        </tr>
                                        <tr>
                                            <td>6</td>
                                            <td>湖北</td>
                                            <td>37109</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="layui-col-sm8">
                                    <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade"
                                         lay-filter="LAY-index-pagethree-home">
                                        <div carousel-item id="LAY-index-pagethree-home">
                                            <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>

        <div class="layui-col-md4">
            <div class="layui-card">
                <div class="layui-card-header">版本信息</div>
                <div class="layui-card-body layui-text layadmin-version">
                    <table class="layui-table">
                        <colgroup>
                            <col width="100">
                            <col>
                        </colgroup>
                        <tbody>
                        <tr>
                            <td>项目名称</td>
                            <td>erp管理系统</td>
                        </tr>
                        <tr>
                            <td>当前版本</td>
                            <td>
                                <script template type="text/html">
                                    v1.0.0
                                </script>
                            </td>
                        </tr>
                        <tr>
                            <td>UI 版本</td>
                            <td>
                                <script template type="text/html">
                                    layui-v{{ layui.v }}
                                </script>
                            </td>
                        </tr>
                        <tr>
                            <td>主要特色</td>
                            <td>单页面 / 响应式 / 清爽 / 极简</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="layui-card">
                <div class="layui-card-header">效果报告</div>
                <div class="layui-card-body layadmin-takerates">
                    <div class="layui-progress" lay-showPercent="yes">
                        <h3>转化率（日同比 28% <span class="layui-edge layui-edge-top" lay-offset="-15" lay-tips="增长"></span>）
                        </h3>
                        <div class="layui-progress-bar" lay-percent="65%"></div>
                    </div>
                    <div class="layui-progress" lay-showPercent="yes">
                        <h3>签到率（日同比 11% <span class="layui-edge layui-edge-bottom" lay-offset="-15"
                                              lay-tips="下降"></span>）</h3>
                        <div class="layui-progress-bar" lay-percent="32%"></div>
                    </div>
                </div>
            </div>

            <div class="layui-card">
                <div class="layui-card-header">进度占用</div>
                <div class="layui-card-body layadmin-takerates">
                    <div class="layui-progress" lay-showPercent="yes">
                        <h3>CPU使用率</h3>
                        <div class="layui-progress-bar" lay-percent="58%"></div>
                    </div>
                    <div class="layui-progress" lay-showPercent="yes">
                        <h3>内存占用率</h3>
                        <div class="layui-progress-bar layui-bg-red" lay-percent="90%"></div>
                    </div>
                </div>
            </div>

            <!-- <div class="layui-card">
              <div class="layui-card-header">项目进展</div>
              <div class="layui-card-body" style="padding: 22px 15px;">
                <table id="LAY-home-homepage-console"></table>
              </div>
            </div> -->

            <div class="layui-card">
                <div class="layui-card-header">产品动态</div>
                <div class="layui-card-body">
                    <div class="layui-carousel layadmin-carousel layadmin-news" data-anim="fade" data-autoplay="true"
                         lay-filter="news">
                        <div carousel-item>
                            <div><a class="layui-bg-red" href="#">layuiAdmin 快速上手文档</a></div>
                            <div><a class="layui-bg-green" href="#">layuiAdmin 技术问答专区</a></div>
                            <div><a class="layui-bg-blue" href="#">layuiAdmin 模板官网</a></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-card">
                <div class="layui-card-header">
                    模板心语
                </div>
                <div class="layui-card-body layui-text layadmin-text">
                    <blockquote class="layui-elem-quote">
                        生意兴隆,财源广进
                    </blockquote>
                </div>
            </div>
        </div>

    </div>
</div>


<script>
    //加载 controller 目录下的对应模块
    /*

      小贴士：
        这里 console 模块对应 的 console.js 并不会重复加载，
        然而该页面的视图则是重新插入到容器，那如何保证能重新来控制视图？有两种方式：
          1): 借助 layui.factory 方法获取 console 模块的工厂（回调函数）给 layui.use
          2): 直接在 layui.use 方法的回调中书写业务代码，即:
              layui.use('console', function(){
                //同 console.js 中的 layui.define 回调中的代码
              });

      这里我们采用的是方式1。其它很多视图中采用的其实都是方式2，因为更简单些，也减少了一个请求数。

    */
    layui.use('console', layui.factory('console'));
</script>

